﻿   <script type="text/javascript">
        (function() {

            window.onload = function() {
                /**禁止拖动设置*/
                document.ontouchmove = function(e) {
                    e.preventDefault();
                };
                
                /**判断浏览器是否支持canvas**/

                try {

                    document.createElement('canvas').getContext('2d');

                } catch (e) {

                    var addDiv = document.createElement('div');

                    alert('您的手机不支持刮刮卡效果哦~!');

                }

            };

            var u = navigator.userAgent,
                mobile = 'PC';

            if (u.indexOf('iPhone') > -1) mobile = 'iphone';

            if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) mobile = 'Android';

            function createCanvas(parent, width, height) {

                var canvas = {};

                canvas.node = document.createElement('canvas');

                canvas.context = canvas.node.getContext('2d');
                //此处可以自己给标签添加
                canvas.node.width = width || 320;

                canvas.node.height = height || 480;
                //给canvas标签添加Id
                canvas.node.id = 'canvasTag';

                parent.appendChild(canvas.node);

                return canvas;

            }

            function init(container, width, height, fillColor, type) {

                var canvas = createCanvas(container, width, height);

                var ctx = canvas.context;

                // define a custom fillCircle method

                ctx.fillCircle = function(x, y, radius, fillColor) {

                    this.fillStyle = fillColor;

                    this.beginPath();

                    this.moveTo(x, y);

                    this.arc(x, y, radius, 0, Math.PI * 2, false);

                    this.fill();

                };

                ctx.clearTo = function(fillColor) {

                    ctx.fillStyle = fillColor;

                    ctx.fillRect(0, 0, width, height);

                };

                ctx.clearTo(fillColor || "#ddd");

                canvas.node.addEventListener(mobile == "PC" ? "mousedown" : "touchstart", function(e) {

                    canvas.isDrawing = true;

                }, false);

                canvas.node.addEventListener(mobile == "PC" ? "mouseup" : "touchend", function(e) {

                    canvas.isDrawing = false;

                }, false);

                canvas.node.addEventListener(mobile == "PC" ? "mousemove" : "touchmove", function(e) {

                    if (!canvas.isDrawing) {

                        return;

                    }

                    if (type == 'Android') {

                        var x = e.changedTouches[0].pageX - this.offsetLeft;

                        var y = e.changedTouches[0].pageY - this.offsetTop;

                    } else {

                        var x = e.pageX - this.offsetLeft;

                        var y = e.pageY - this.offsetTop;

                    }

                    var radius = 20;

                    var fillColor = '#ff0000';

                    ctx.globalCompositeOperation = 'destination-out';

                    ctx.fillCircle(x, y, radius, fillColor);

                }, false);

            }
			
			var a=1;
			var b=1;
			var c=1;

            var container = document.getElementById('a');
			
			var container2 = document.getElementById('b');
			
			var container3 = document.getElementById('c');
			
			var container4 = document.getElementById('d');
			
			var container5 = document.getElementById('e');

            init(container, 54, 54, '#696868', mobile);

			init(container2, 54, 54, '#696868', mobile);

			init(container3, 54, 54, '#696868', mobile);
			
			init(container4, 54, 54, '#696868', mobile);
			
			init(container5, 54, 54, '#696868', mobile);

			
        })();
    </script>
    
    
<script>
$(document).ready(function(e) {
    $('.hongbao').click(function(){
		$(this).fadeOut(100);
		$('.jinku').fadeIn(300);
		});
		
	$('.in_jia_ico').click(function(){
		$(this).css('display','none');
		$('.in_jia_ico2').css('display','block');
		$('.in_say_content').slideDown(300);
		})
		
	$('.in_jia_ico2').click(function(){
		$(this).css('display','none');
		$('.in_jia_ico').css('display','block');
		$('.in_say_content').slideUp(100);
		})
		
});
</script>